<template>
  <h2>TableThGroup</h2>
  <p>一种表格单元格组件。默认内边距 12px。</p>
  <h3>TableThGroup 属性</h3>
  <table-info type="props" :data="data"></table-info>
  <h3>案例</h3>
  <code-demo :code="code">
    <div
      style="
        position: relative;
        width: 200px;
        height: 50px;
        border: 1px solid #ddd;
      "
    >
      <table-th-group
        leftLabel="leftLabel"
        rightLabel="rightLabel"
        :style="{ padding: '8px' }"
      ></table-th-group>
    </div>
  </code-demo>
</template>

<script setup>
const data = [
  { name: 'leftLabel', desc: '主内容', type: 'string' },
  { name: 'rightLabel', desc: '主内容', type: 'string' },
  { name: 'style', desc: '用于覆盖组件样式', type: 'Object' },
]

const code = `<div style=" position: relative; width: 200px; height: 50px; border: 1px solid #ddd;">
  <table-th-group
    leftLabel="leftLabel"
    rightLabel="rightLabel"
    :style="{ padding: '8px' }"
  ></table-th-group>
</div>`
</script>
